<template>
  <div style="width: 600px;margin: 30px auto 0;">
    <el-form ref="form" :rules="rules" :model="form" label-width="160px">
      <el-row>
        <el-col :span="24">
          <div class="grid-content bg-purple">
            <el-form-item label="发票抬头" prop="title" style="margin-right:15px">
              <el-input v-model="form.title" placeholder="请输入发票抬头" />
            </el-form-item>
          </div>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <div class="grid-content bg-purple">
            <el-form-item label="税务登记证号" prop="taxRegistryNumber" style="margin-right:15px">
              <el-input v-model="form.taxRegistryNumber" placeholder="请输入税务登记证号" />
            </el-form-item>
          </div>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <div class="grid-content bg-purple">
            <el-form-item label="基本开户行" prop="bankCode" style="margin-right:15px">
              <el-select v-model="form.bankCode" placeholder="请选择">
                <el-option
                  v-for="(v,k) in dicts.bank"
                  :key="k"
                  :label="v"
                  :value="k"
                />
              </el-select>
            </el-form-item>
          </div>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <div class="grid-content bg-purple">
            <el-form-item label="注册场所地址" prop="registeredAddress" style="margin-right:15px">
              <el-input v-model="form.registeredAddress" placeholder="请输入注册场所地址" />
            </el-form-item>
          </div>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <div class="grid-content bg-purple">
            <el-form-item label="注册固定电话" prop="registeredPhone" style="margin-right:15px">
              <el-input v-model="form.registeredPhone" placeholder="请输入注册固定电话" />
            </el-form-item>
          </div>
        </el-col>
      </el-row>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="funcSubmit">确 定</el-button>
    </div>
  </div>
</template>
<script>
import Vue from 'vue'
import 'xe-utils'
import VXETable from 'vxe-table'
import 'vxe-table/lib/index.css'
import request from '@/utils/request'
import { getDictByType } from '@/api/commonApi'
// import { isURL, isEmail, isCellphone } from '@/utils/validate4Form'
Vue.use(VXETable)
export default {
  name: 'PartyGroupInvoice',
  components: {},
  data() {
    return {
      dicts: { bank: {}},
      form: {
        code: '',
        branchCode: '',
        title: '',
        taxRegistryNumber: '',
        bankCode: '',
        registeredAddress: '',
        registeredPhone: ''
      },
      rules: {
        title: [
          { required: true, message: '请输入发票抬头', trigger: 'blur' },
          { min: 1, max: 120, message: '长度在 1 到 120 个字符', trigger: 'blur' }
        ],
        taxRegistryNumber: [
          { required: true, message: '请输入税务登记证号', trigger: 'blur' },
          
        ],
        bankCode: [
          { required: true, message: '请选择基本开户行', trigger: 'blur' }
        ],
        registeredAddress: [
          { required: true, message: '请输入注册场所地址', trigger: 'blur' },
          { min: 1, max: 120, message: '长度在 1 到 120 个字符', trigger: 'blur' }
        ],
        registeredPhone: [
          { required: true, message: '请输入注册固定电话', trigger: 'blur' },
          
        ]
      }
    }
  },
  async created() {
    this.dicts = { bannerType: {}}
    const dicts = await getDictByType('bank')
    this.$set(this.dicts, 'bank', dicts.bank)
    const entity = await this.getInfo()
    if (entity) {
      this.form = entity
    }
  },
  methods: {
    getInfo() {
      return request({ url: `/arpa-basic-api/partyGroupInvoice/one`, method: 'get' }).then(response => {
        return response.data
      })
    },
    // 提交
    funcSubmit() {
      this.$refs['form'].validate((valid) => {
        if (valid) {
          const data = this.form
          const rLoading = this.openLoading();
          if (data.code) {
            request({ url: '/arpa-basic-api/partyGroupInvoice', method: 'put', params: data }).then(response => {
              rLoading.close();
              this.$message({ message: response.msg, type: 'success' })
            })
          } else {
            request({ url: '/arpa-basic-api/partyGroupInvoice', method: 'post', params: data }).then(response => {
              rLoading.close();
              this.$message({ message: response.msg, type: 'success' })
            })
          }
        } else {
          return false
        }
      })
    }
  }
}
</script>
<style lang="scss" scoped>
  .dialog-footer {
    margin: 15px 0 15px 0;
    width: 175px;
    float: right;
  }
</style>
